import './start.css'
import {Outlet, useNavigate} from "react-router-dom"
import {checkLogged} from "../../request/login"
import {Button, message, Table} from "antd"
import {reset} from "../../request/fake-db"
import logo from './logo.svg'
import {useEffect} from "react"

function Start() {
    const navigate = useNavigate()
    useEffect(() => {
        if (window.location.pathname === '/start') {
            navigate('/start/login')
        }
    }, [navigate])

    checkLogged().then(({role}) => {
        if (role) {
            window.location.assign("/backstage/home")
        } else {
            window.location.assign("/mall/home")
        }
    }).catch(() => {})
    return (
        <div className="start-back">
            <div className="start-container">
                <div className="info-container">
                    <img src={logo} alt="logo"/>
                    <div className="content">
                        <span>如果天才的你把角色禁用或删除了</span>
                        <span>可以在这里重置数据库</span>
                        <Button type="primary" onClick={() => {
                            reset()
                            message.success('数据库重置成功')
                        }}>重置数据库</Button>
                        <Table
                            columns={[
                                {
                                    title: '角色',
                                    dataIndex: 'role',
                                    key: 'role',
                                    align: 'center',
                                    width: 300
                                },
                                {
                                    title: '账号',
                                    dataIndex: 'uid',
                                    key: 'uid',
                                    align: 'center',
                                    width: 150
                                },
                                {
                                    title: '密码',
                                    dataIndex: 'password',
                                    key: 'password',
                                    align: 'center',
                                    width: 150
                                },
                            ]}
                            dataSource={[
                                {key: 0, role: '超级管理员', uid: 'Admin', password: 'Admin666'},
                                {key: 1, role: '用户', uid: 'User', password: 'User6666'}
                            ]}
                            pagination={false}
                        />
                        <div>[测试账号]</div>
                    </div>
                </div>
                <div className="form-container">
                    <Outlet/>
                </div>
            </div>
        </div>

    )
}

export default Start